﻿<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>佳得乐周报自动化工具</title>
    <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
    <style type="text/css">
        .crow {
            width: 90%;
            margin-left: 5%;
            border-top: 3px #cccccc solid;
            float: left;
        }

        .title {
            width: 90%;
            margin-left: 5%;
            margin-top: 100px;
            height: 60px;
            float: left;
            line-height: 60px;
            text-align: center;
            font-size: 32px;
            font-family: 'Microsoft YaHei';
        }

        .btnView {
            width: 500px;
            height: 60px;
            margin: 0 auto;
            margin-top: 80px;
            text-align: center;
            font-size: 22px;
            font-family: 'Microsoft YaHei';
            color: #FFFFFF;
        }

            .btnView .upload {
                width: 200px;
                height: 60px;
                float: left;
                background-color: #CCCCCC;
                line-height: 60px;
                border: 1px #cccccc solid;
                border-radius: 6px;
            }

            .btnView .downLoad {
                width: 200px;
                height: 60px;
                float: right;
                line-height: 60px;
                border: 1px #cccccc solid;
                border-radius: 6px;
                background-color: #CCCCCC;
            }


        img {
            width: 100%;
            height: 100%;
            opacity: 0.8; /*设置背景色透明度,1为完全不透明,IE需要使用filter:alpha(opacity=80);*/
            filter: alpha(opacity=80);
            position: absolute;
            top: 0;
            left: 0;
            z-index: 1;
            background: silver;
            display: none;
        }
    </style>
</head>
<body>
    <div class="title">佳得乐周报自动化工具</div>
    <div class="crow">
        <div class="btnView">
            <div class="upload">
                上传 Excel
            </div>
            <div class="downLoad">
                下载 PPT
            </div>
        </div>
    </div>
    <img src="img/timg.gif" alt="" id="imgLoading" />
    <input type="file" id="upload" style="width:0px;" />
    <script type="text/javascript">
        var dataStatus = "";
        jQuery("#upload").bind("change", function () {
            var url = "http://47.111.29.148:10006/ppt/jdl/jdlExcelUpload";
            var formData = new FormData();
            formData.append("file", document.getElementById("upload").files[0]);
            var xhr = new XMLHttpRequest();
            xhr.onreadystatechange = function () {
                if (xhr.readyState == 4) {
                    document.getElementById("upload").value = "";
                    var data = xhr.responseText;
                    //window.open(url);
                    document.getElementById("imgLoading").style.display = "none";

                    window.location.reload();
                }
            };
            xhr.open("post", url, true);
            xhr.send(formData);

            document.getElementById("imgLoading").style.display = "block";
        });


        var serInt = setInterval("GetUploadDataStatus()", 3000);
        /*code:0 处理中， 1：处理成功，2 处理失败*/
        function GetUploadDataStatus() {
            var url = "http://47.111.29.148:10006/ppt/jdl/getStatus";
            jQuery.ajax(
                {
                    type: "GET",
                    contentType: "application/text;charset=UTF-8",
                    url: url,
                    success: function (result) {
                        if (dataStatus != result.msg) {
                            dataStatus = result.msg;
                            if (dataStatus == "ppt-success") {
                                jQuery(".btnView .downLoad").css("background-color", "#FF791A");
                                jQuery(".btnView .downLoad").css("cursor", "pointer");
                                jQuery(".btnView .downLoad").bind("click", function () {
                                    url = "http://47.111.29.148:10006/ppt/jdl/jdlDownload";
                                    window.open(url);
                                });

                                jQuery(".btnView .upload").css("background-color", "#FF791A");
                                jQuery(".btnView .upload").css("cursor", "pointer");
                                jQuery(".btnView .upload").bind("click", function () {
                                    document.getElementById("upload").click();
                                });
                            } else if (dataStatus == "ppt-error" || dataStatus == "excel-error" || dataStatus == "data-error") {
                                alert("Excel 格式或者数据错误，请重新上传!");
                                jQuery(".btnView .upload").css("background-color", "#FF791A");
                                jQuery(".btnView .upload").css("cursor", "pointer");
                                jQuery(".btnView .upload").bind("click", function () {
                                    document.getElementById("upload").click();
                                });
                            } else if (dataStatus == "fail") {
                                jQuery(".btnView .upload").css("background-color", "#FF791A");
                                jQuery(".btnView .upload").css("cursor", "pointer");
                                jQuery(".btnView .upload").bind("click", function () {
                                    document.getElementById("upload").click();
                                });
                            }
                        }
                    },
                    error: function (e) {
                        alert(e);
                    }
                });
        }

      


    </script>
</body>
</html> 